<template>
    <div class="editable-cell">
        <a-input type="number" :disabled="disabled" :value="value" @change="handleChange" @blur="check"  @pressEnter="check" />

    </div>
  </template>
  
  <script>
  export default {
    name: 'EditNumberCell2',
    props: {
      text: {
        type: [String,Number]
      },
      disabled: Boolean,
      max: {
        type: Number,
        required: false,
        default: 0
      }
    },
    watch:{
      max: {
        immediate: true,
        handler(val) {
          // this.resetChecked = val;
        }
      },
      text: {
        immediate: true,
        handler(val) {    
          this.value=val
        }
      },
    },
    mounted(){
      this.$nextTick(() => {
      });
    },
    created() {
    },
    data() {
      return {
        value: this.text,
        editable: false
      };
    },
    computed: {
      debugMax() {
        return this.max;
      }
    },
    methods: {
      handleChange(e) {
        const value = e.target.value;
        this.value = value;
      },
      check() {
        this.$forceUpdate();
        this.$nextTick(()=>{
          if(Number(this.max) > 0 && Number(this.value) > Number(this.max)){
            this.$message.warn("当前值大于最大可用值,已改为最大数量");
            this.value = Number(this.max)
          }
          this.editable = false;
          this.$emit('change', this.value);
  
        })
      },
    }
  };
  </script>
  
  <style scoped>
  .editable-cell {
    position: relative;
    
  }
  </style>